Built-in Animations (Fade, Translate, Scale, Rotate)

.NET MAUI-তে Animations (অ্যানিমেশন) এবং Visual Effects (ভিজ্যুয়াল এফেক্টস) অ্যাপ্লিকেশনের ইউজার ইন্টারফেসকে আরও আকর্ষণীয় ও ইন্টারঅ্যাকটিভ করে তোলে। এই অ্যানিমেশনগুলো ব্যবহার করে আপনি UI উপাদান যেমন ফেড, স্কেল, রোটেট এবং ট্রান্সলেট অ্যানিমেশন তৈরি করতে পারেন, যা অ্যাপ্লিকেশনকে আরো প্রাণবন্ত এবং ব্যবহারকারী-বান্ধব করে তোলে।

1. Fade Animation (ফেড অ্যানিমেশন)

ফেড অ্যানিমেশন হল এমন একটি অ্যানিমেশন যা কোনো উপাদানের opacity (দৃশ্যমানতা) পরিবর্তন করে। আপনি একটি উপাদানকে ফেড ইন (দৃশ্যমান করা) অথবা ফেড আউট (অদৃশ্য করা) করতে পারেন।

উদাহরণ: Fade Animation

// Fade ইন অ্যানিমেশন
await myLabel.FadeTo(1, 1000); // 1 = পূর্ণ দৃশ্যমান, 1000 = 1 সেকেন্ডে

// Fade আউট অ্যানিমেশন
await myLabel.FadeTo(0, 1000); // 0 = অদৃশ্য, 1000 = 1 সেকেন্ডে
Copy

• FadeTo(double opacity, uint duration):
  • opacity: লক্ষ্য করা opacity (0 = অদৃশ্য, 1 = পূর্ণ দৃশ্যমান)।
  • duration: অ্যানিমেশনের সময়কাল (মিলিসেকেন্ডে)।

2. Translate Animation (ট্রান্সলেট অ্যানিমেশন)

ট্রান্সলেট অ্যানিমেশন উপাদানকে X এবং Y অক্ষের বরাবর স্থানান্তরিত করে। এটি উপাদানকে অনুভূমিক বা উল্লম্বভাবে সরাতে সাহায্য করে।

উদাহরণ: Translate Animation

// উপাদানটিকে অনুভূমিকভাবে 100 পিক্সেল স্থানান্তরিত করা
await myLabel.TranslateTo(100, 0, 1000); // (100,0) স্থানান্তর 1 সেকেন্ডে

// উপাদানটিকে ডায়াগনালি স্থানান্তরিত করা
await myLabel.TranslateTo(100, 100, 1000); // (100,100) স্থানান্তর 1 সেকেন্ডে
Copy

• TranslateTo(double x, double y, uint duration):
  • x: লক্ষ্য অনুভূমিক অবস্থান।
  • y: লক্ষ্য উল্লম্ব অবস্থান।
  • duration: স্থানান্তরের সময়কাল।

এছাড়া, TranslateBy(x, y) ব্যবহার করে আপনি উপাদানটির বর্তমান অবস্থান থেকে কিছু পরিমাণ স্থানান্তর করতে পারেন।

3. Scale Animation (স্কেল অ্যানিমেশন)

স্কেল অ্যানিমেশন একটি উপাদানের আকার পরিবর্তন করে। এটি উপাদানকে বড় বা ছোট করতে ব্যবহৃত হয়।

উদাহরণ: Scale Animation

// উপাদানটিকে 2 গুণ বড় করা
await myLabel.ScaleTo(2, 1000); // 2x সাইজ, 1 সেকেন্ডে

// উপাদানটিকে ছোট করা
await myLabel.ScaleTo(0.5, 1000); // অর্ধেক সাইজ, 1 সেকেন্ডে
Copy

• ScaleTo(double scale, uint duration):
  • scale: লক্ষ্য স্কেল ফ্যাক্টর (1 = মূল আকার, >1 = বড়, <1 = ছোট)।
  • duration: স্কেলিং অ্যানিমেশনের সময়কাল।

এছাড়া, ScaleBy(scale) ব্যবহার করে আপনি বর্তমান আকারের তুলনায় কিছু স্কেল পরিবর্তন করতে পারেন।

4. Rotate Animation (রোটেট অ্যানিমেশন)

রোটেট অ্যানিমেশন একটি উপাদানকে তার কেন্দ্রের চারপাশে ঘুরায়। আপনি উপাদানটিকে ক্লকওয়াইজ বা আনক্লকওয়াইজ ঘুরাতে পারেন।

উদাহরণ: Rotate Animation

// উপাদানটিকে 90 ডিগ্রি ঘুরানো
await myLabel.RotateTo(90, 1000); // 90 ডিগ্রি, 1 সেকেন্ডে

// উপাদানটিকে মূল অবস্থায় ফিরিয়ে আনা (0 ডিগ্রি)
await myLabel.RotateTo(0, 1000); // 0 ডিগ্রি, 1 সেকেন্ডে
Copy

• RotateTo(double degrees, uint duration):
  • degrees: লক্ষ্য রোটেশন ডিগ্রি (পজিটিভ ক্লকওয়াইজ, নেগেটিভ আনক্লকওয়াইজ)।
  • duration: ঘূর্ণন অ্যানিমেশনের সময়কাল।

এছাড়া, RotateBy(degrees) ব্যবহার করে আপনি বর্তমান রোটেশন থেকে কিছু ডিগ্রি ঘুরাতে পারেন।

5. Combining Animations (একাধিক অ্যানিমেশন একসাথে চালানো)

আপনি একাধিক অ্যানিমেশন একসাথে চালাতে পারেন, যা খুবই শক্তিশালী একটি বৈশিষ্ট্য। এটি Task.WhenAll ব্যবহার করে করা যায়, যাতে একাধিক অ্যানিমেশন একযোগে চলে।

উদাহরণ: Combining Animations

// Fade আউট এবং তারপর ট্রান্সলেট করা
await myLabel.FadeTo(0, 1000); // 1 সেকেন্ডে Fade আউট
await myLabel.TranslateTo(100, 100, 1000); // এরপর (100, 100) এ স্থানান্তর

// একযোগে অ্যানিমেশন: রোটেট, স্কেল এবং ফেড
await Task.WhenAll(
    myLabel.RotateTo(90, 1000),    // 90 ডিগ্রি ঘুরানো
    myLabel.ScaleTo(2, 1000),      // দ্বিগুণ আকারে স্কেল করা
    myLabel.FadeTo(1, 1000)        // পূর্ণ দৃশ্যমান করা
);
Copy

এখানে, Task.WhenAll() ব্যবহার করে তিনটি অ্যানিমেশন একসাথে চালানো হয়েছে।

6. Easing Functions (অ্যানিমেশনের স্নিগ্ধতা)

.NET MAUI অ্যানিমেশনগুলিতে Easing ফাংশন যোগ করতে পারে, যা অ্যানিমেশনের গতির ধরণ নির্ধারণ করে। উদাহরণস্বরূপ, Bounce বা Elastic ইফেক্ট অ্যাপ্লিকেশনটির অ্যানিমেশনকে আরও আকর্ষণীয় করে তোলে।

উদাহরণ: Easing Function

// Bouncing Easing প্রভাব দিয়ে স্কেল করা
await myLabel.ScaleTo(2, 1000, Easing.BounceIn);  // Bounce ইন ইফেক্ট
Copy

• Easing বিভিন্ন বিল্ট-ইন easing ফাংশন প্রদান করে, যেমন:
  • Easing.Linear: একটি সোজা অ্যানিমেশন।
  • Easing.BounceIn: শুরুতে বাউন্স প্রভাব।
  • Easing.CubicInOut: মসৃণ শুরুর এবং শেষের অ্যানিমেশন।

Conclusion (সারাংশ):

• .NET MAUI তে অ্যানিমেশন ব্যবহার করে আপনি ফেড, স্কেল, রোটেট, ট্রান্সলেট ইত্যাদি অ্যানিমেশন যোগ করতে পারেন, যা অ্যাপ্লিকেশনটির ইউজার ইন্টারফেসকে আরও প্রাণবন্ত এবং ইন্টারঅ্যাকটিভ করে তোলে।
• Easing ফাংশন ব্যবহার করে অ্যানিমেশনগুলিতে সুন্দর প্রভাব যোগ করা যায়।
• একাধিক অ্যানিমেশন একযোগে চালিয়ে আরও জটিল এবং আকর্ষণীয় ইফেক্ট তৈরি করা সম্ভব।

এই কৌশলগুলি ব্যবহার করে আপনি আপনার .NET MAUI অ্যাপ্লিকেশনকে আরও ডায়নামিক এবং ইউজার-বান্ধব করতে পারবেন।